<template>
  <div class="app-container content_app">
    <el-row>
      <el-col :span="12">
        <p
          style="
            text-align: center;
            font-size: 24px;
            font-weight: 700;
            margin: 10px 0;
          "
        >
        現金流量表
        </p>
        <div>
          <p style="margin: 10px 0">
            <span> 公司名稱： </span>
            <span>永力投資有限公司</span>
          </p>
          <p style="margin: 10px 0">
            <span> 會計期間： </span>
            <span>
              <el-date-picker
                v-model="dateArr"
                value-format="yyyy-MM-dd"
                type="daterange"
                range-separator="至"
                start-placeholder="開始日期"
                end-placeholder="結束日期"
              >
              </el-date-picker>
              <el-button
                style="margin-left: 16px"
                type="primary"
                size="mini"
                @click="getList"
                >生成</el-button
              >
              <el-button
                style="margin-left: 16px"
                type="primary"
                size="mini"
                @click="exportExcel"
                >導出</el-button
              >
            </span>
          </p>
          <p style="margin: 10px 0">
            <span> 單位： </span>
            <span> 港幣 </span>
          </p>
        </div>
        <el-table
          class="table_content"
          :data="tableData"
          border
          stripe
          style="width: 100%"
          :row-style="{ height: '26px' }"
        >
          <el-table-column prop="data1" label="項目"> </el-table-column>
          <el-table-column prop="data2" label="本期累計數"> </el-table-column>
        </el-table>
      </el-col>
    </el-row>
  </div>
</template>
  
  <script>
import { getAccountCashFlowStatement } from "@/api/biz/entry";

export default {
  name: "CashFlowStatement",
  components: {},
  data() {
    return {
      // 遮罩层
      loading: true,
      // 查询參數
      queryParams: {
        startDate: this.$moment().subtract(1, "years").format("YYYY-MM-DD"),
        endDate: this.$moment().format("YYYY-MM-DD"),
      },
      dateArr: [
      this.$moment().startOf('month').format("YYYY-MM-DD"),
        this.$moment().format("YYYY-MM-DD"),
      ],
      tableData: [
        {
          data1: "一、經營活動產生的現金流量：",
          data2: "",
        },
        {
          data1: "銷售商品、提供勞務收到的現金",
          data2: "",
        },
        {
          data1: "收到其他與經營活動有關的現金",
          data2: "",
        },
        {
          data1: "經營活動現金流入小計",
          data2: "",
        },
        {
          data1: "購買商品、接受勞務支付的現金",
          data2: "",
        },
        {
          data1: "支付給職工以及為職工支付的現金",
          data2: "",
        },
        {
          data1: "支付的各項稅費",
          data2: "",
        },
        {
          data1: "支付其他與經營活動有關的現金",
          data2: "",
        },
        {
          data1: "經營活動現金流出小計",
          data2: "",
        },
        {
          data1: "經營活動產生的現金流量淨額",
          data2: "",
        },
        {
          data1: "二、投資活動產生的現金流量：",
          data2: "",
        },
        {
          data1: "收回投資收到的現金",
          data2: "",
        },
        {
          data1: "取得投資收益收到的現金",
          data2: "",
        },
        {
          data1: "處置固定資產、無形資產和其他長期資產收回的現金淨額",
          data2: "",
        },
        {
          data1: "處置子公司及其他營業單位收到的現金淨額",
          data2: "",
        },
        {
          data1: "收到其他與投資活動有關的現金",
          data2: "",
        },
        {
          data1: "投資活動現金流入小計",
          data2: "",
        },
        {
          data1: "購建固定資產、無形資產和其他長期資產支付的現金",
          data2: "",
        },
        {
          data1: "投資支付的現金",
          data2: "",
        },
        {
          data1: "取得子公司及其他營業單位支付的現金淨額",
          data2: "",
        },
        {
          data1: "支付其他與投資活動有關的現金",
          data2: "",
        },
        {
          data1: "投資活動現金流出小計",
          data2: "",
        },
        {
          data1: "投資活動產生的現金流量淨額",
          data2: "",
        },
        {
          data1: "三、籌資活動產生的現金流量：",
          data2: "",
        },
        {
          data1: "吸收投資收到的現金",
          data2: "",
        },
        {
          data1: "取得借款收到的現金",
          data2: "",
        },
        {
          data1: "收到其他與籌資活動有關的現金",
          data2: "",
        },
        {
          data1: "籌資活動現金流入小計",
          data2: "",
        },
        {
          data1: "償還債務支付的現金",
          data2: "",
        },
        {
          data1: "分配股利、利潤或償付利息支付的現金",
          data2: "",
        },
        {
          data1: "支付其他與籌資活動有關的現金",
          data2: "",
        },
        {
          data1: "籌資活動現金流出小計",
          data2: "",
        },
        {
          data1: "籌資活動產生的現金流量淨額",
          data2: "",
        },
        {
          data1: "四、匯率變動對現金及現金等價物的影響",
          data2: "",
        },
        {
          data1: "五、現金及現金等價物淨增加額",
          data2: "",
        },
        {
          data1: "加：期初現金及現金等價物餘額",
          data2: "",
        },
        {
          data1: "六、期末現金及現金等價物餘額",
          data2: "",
        },
       
      ],
    };
  },
  created() {},
  mounted() {
    this.getList();
  },
  methods: {
    getList() {
      this.queryParams.startDate = this.dateArr[0];
      this.queryParams.endDate = this.dateArr[1];
      getAccountCashFlowStatement(this.queryParams).then((response) => {
        let dataSet = response.data;
        this.tableData[1].data2 = dataSet.accountsReceivable;
        this.tableData[2].data2 = dataSet.otherCash;
        this.tableData[3].data2 = dataSet.cashInflowSubtotal;
        this.tableData[5].data2 = dataSet.employeeFees;
        this.tableData[6].data2 = dataSet.taxFees;
        this.tableData[7].data2 = dataSet.otherFees;
        this.tableData[8].data2 = dataSet.cashOutflowSubtotal;
        this.tableData[9].data2 = dataSet.netCashFlowFromOperatingActivities;
        this.tableData[34].data2 = dataSet.netCashFlowFromOperatingActivities;
        this.tableData[35].data2 = dataSet.qcCashAmount;
        this.tableData[36].data2 = dataSet.qmCashAmount;

      });
    },
    exportExcel() {
      this.download_get(
        "biz/entry/accounting/cashFlowStatement/export",
        {
          ...this.queryParams,
        },
        `現金流量表_${new Date().getTime()}.xlsx`
      );
    },
  },
};
</script>
  <style scoped lang="scss">
::v-deep .table_content {
  th {
    padding: 0 !important;
    height: 10px;
    line-height: 10px;
  }
  td {
    padding: 0 !important;
    height: 30px;
    line-height: 30px;
  }
}
</style>
  